/**
 * Created by solaman on 2017/5/4.
 */

Vue.component('message',{
    props:['title','body'],
    template:`
        <article class="message" v-show="isVisible">
        <div class="message-header">
            <p>{{ title }}</p>
            <button class="delete" @click="hideModal"></button>
        </div>
        <div class="message-body">
            {{ body }}
        </div>
    </article>
    `,
    data(){
      return {
          isVisible: true
      }
    },

    methods:{
       hideModal(){
           this.isVisible = false;
       }
    }
})

let app = new Vue({

    el: '#root'

})